:root {
    // 通用色系变量
    --ct8: hsl(230, 73%, 52%);
    --ct0: #ecf5ff;
    --cth8: #585858;
    --cth6: #989898;
    --cth2: #e0e0e0;
    --cth0: #fffffe;
    --ctx8: #8db580;
    --ctx0: #f1f7f1;
    --ctz8: #d65c5c;
    --ctz0: #f7eeee;
    // 字体大小变量
    --fs8: 80px;
    --fs7: 70px;
    --fs6: 60px;
    --fs5: 50px;
    --fs4: 40px;
    --fs3: 30px;
    --fs2: 20px;
    --fs1: 18px;
    --fs0: 12px; // 最小字号
    --fsm: 22px; // 默认字号
    // 通用板式变量
    --padding: 5px 12px;
    --radius: 12px;
    --shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    --shadow2: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.theme-light {
    // 主色系变量
    --cm8: hsl(222, 63%, 55%);
    --cm6: hsl(222, 63%, 63%);
    --cm4: hsl(222, 63%, 81%);
    --cm2: hsl(222, 63%, 89%);
    --cm1: hsl(222, 63%, 94%);
    --cm0: hsl(222, 63%, 96%);
    // 灰度色系变量
    --ch8: #585858;
    --ch6: #989898;
    --ch4: #d8d8d8;
    --ch2: #f5f5f5;
    --ch0: #fffffe;
    // 成功色系变量
    --cx8: #8db580;
    --cx4: #a2eea2;
    --cx0: #f1f7f1;
    // 警告色系变量
    --cy8: #ffb400;
    --cy4: #eee9a2;
    --cy0: #f7f6ec;
    // 错误色系变量
    --cz8: #d65c5c;
    --cz4: #eea2a2;
    --cz0: #f7eeee;
}

.theme-dark {
    // 主色系变量
    --cm8: #ecf5ff;
    --cm6: #c6e2ff;
    --cm4: #a0cfff;
    --cm2: #409eff;
    --cm0: #337ecc;
    // 灰度色系变量
    --ch8: #fffffe;
    --ch6: #f5f5f5;
    --ch4: #d8d8d8;
    --ch2: #989898;
    --ch0: #585858;
    // 成功色系变量
    --cx8: #f1f7f1;
    --cx4: #a2eea2;
    --cx0: #35c230;
    // 警告色系变量
    --cy8: #f7f6ec;
    --cy4: #eee9a2;
    --cy0: #c2b830;
    // 错误色系变量
    --cz8: #f7eeee;
    --cz4: #eea2a2;
    --cz0: #d65c5c;
}
